<form name="altEditor-form" role="form" id="splForm" th:object="${splform}" th:action="@{/savespl}" method="post">
					
	<input type='hidden' class='primarykey' id="idSpl" th:field="*{idSpl}">
	
	<div class="form-group">
		
			<label for="name" class="col-form-label" th:text="#{form.log.spl.name}"></label>
			<script th:inline="javascript">
				/*<![CDATA[*/
				    var messageName = /*[[#{form.log.spl.name.pattern}]]*/ 'default';
				/*]]>*/
			</script>
			<input onblur="validate(this, messageName);" type="text" id="name" th:field="*{name}" style="overflow:hidden" class="form-control" required pattern=".{3,30}" />
			<div id="invalid-name" class="invalid-feedback" ></div>
		
		<div style="clear:both;"/>
	</div>
	
	<div class="form-group">
		
			<label for="description" class="col-form-label" th:text="#{form.log.spl.description}"></label>
			<script th:inline="javascript">
				/*<![CDATA[*/
				    var messageDescription = /*[[#{form.log.spl.description.pattern}]]*/ 'default';
				/*]]>*/
			</script>
			<input onblur="validate(this, messageDescription);" type="text" id="description" th:field="*{description}" style="overflow:hidden" class="form-control" required pattern=".{3,255}"/>
			<div id="invalid-description" class="invalid-feedback" ></div>
		
		<div style="clear:both;"/>
	</div>

	<div class="form-group">
	
		<label for="type" class="col-form-label" th:text="#{form.log.spl.type}"></label>
		<script th:inline="javascript">
			/*<![CDATA[*/
			    var messageType = /*[[#{form.log.spl.type.pattern}]]*/ 'default';
			/*]]>*/
		</script>
		<input onblur="validate(this, messageType);" type="text" id="type" th:field="*{type}" style="overflow:hidden" class="form-control" required pattern=".{3,30}"/>
		<div id="invalid-type" class="invalid-feedback" ></div>
		
		<div style="clear:both;"/>
	</div>
	
	<div class="form-group">
		
		<label for="url" class="col-form-label" th:text="#{form.log.spl.url}"></label>
		<script th:inline="javascript">
			/*<![CDATA[*/
			    var messageUrl = /*[[#{form.log.spl.url.pattern}]]*/ 'default';
			/*]]>*/
		</script>
		<input onblur="validate(this, messageUrl);" type="text" id="url" th:field="*{url}" style="overflow:hidden" class="form-control" required pattern=".{3,255}"/>
		<div id="invalid-url" class="invalid-feedback" ></div>
	
		<div style="clear:both;"/>
	</div>
		
	<div class="form-group">
		
		<label for="key" class="col-form-label" th:text="#{form.log.spl.key}"></label>
		<script th:inline="javascript">
			/*<![CDATA[*/
			    var messageKey = /*[[#{form.log.spl.key.pattern}]]*/ 'default';
			/*]]>*/
		</script>
		<input onblur="validate(this, messageKey);" type="text" id="key" th:field="*{key}" style="overflow:hidden" class="form-control" required pattern=".{3,100}"/>
		<div id="invalid-key" class="invalid-feedback" ></div>
	
		<div style="clear:both;"/>
	</div>
	
	<div class="form-row">
		<button type="button" class="btn btn-secondary" id="check-connection-button" >Comprobar conexi&oacute;n</button>
		<span id="connection-result" class="mon-alert-message" role="alert"></span>
	</div>
</form>

<script th:inline="javascript">
$(document).ready(function () {

    $("#check-connection-button").on("click", function () {

    	$.ajax("checkspl", {
	        type: 'POST',
	        data: $.param({'urlTex': $('#url').val()}),
	        success: function(data, status, response) {

				console.log("Conexion correcta");
				
				console.log(data);
				
				if (data === true) {
					$("#connection-result").removeClass("alert-success alert-danger");
					$("#connection-result").addClass("alert-success");
					$("#connection-result").html("<strong>Conexi&oacute;n correcta</strong>");
				}
				else {
					$("#connection-result").removeClass("alert-success alert-danger");
		        	$("#connection-result").addClass("alert-danger");
		        	$("#connection-result").html("<strong>No se ha podido conectar con el servidor</strong>");	
				}
	        },
	        error: function(err) {
	        	console.log("Conexion fallida");
	        	$("#connection-result").removeClass("alert-success alert-danger");
	        	$("#connection-result").addClass("alert-danger");
	        	$("#connection-result").html("<strong>No se ha podido comprobar la conexi&oacute;n con el servidor</strong>");
			}
		});
    });
});
</script>